<template>
	<view>
		<view class="main" style="display: block;float: left;">
			<view class="center_qb t23">实名认证信息</view>
			<view class="shuru" v-if="showPhone">
				<text class="shuru_tit t1">邀请人</text>
				<input type="text" class="shuru_text t1" value="" v-model="yqrPhone" placeholder="请输入邀请人手机号" />
			</view>

			<view class="shuru">
				<text class="shuru_tit t1" style="width:40%;display: block;float: left;height: auto;">地区</text>
				<picker mode="multiSelector" @columnchange="xuanzediqu" :value="dmultiIndex" :range="dmultiArray">
					<view class="shuru_text2 t1" v-if="diqu!=''" style="min-height: 10vw;width: 60%;">
						{{diqu}}
					</view>
					<view class="shuru_text2 t1" v-if="diqu==''" style="min-height: 10vw;width: 60%;">
						{{dmultiArray[0][dmultiIndex[0]]}}，{{dmultiArray[1][dmultiIndex[1]]}}，{{dmultiArray[2][dmultiIndex[2]]}}，{{dmultiArray[3][dmultiIndex[3]]}}
					</view>

				</picker>
			</view>
			<view class="hint-addr">（ 注:选择地区请与身份证保持一致 ）</view>

			<view class="baodan_zhu t1">
				<view class="baodan_tit t1">身份证人像面照片</view>
				<view class="uni-padding-wrap uni-common-mt baodan_into" @click="fchooseImage">
					<block v-if="fimage">
						<image :src="fimage" class="image baodan_into_image" mode="widthFix"></image>
					</block>
				</view>
			</view>

			<view class="tuic t2" @click="confirm()" style="width: 100%;margin: 10vw 0;">确定</view>

			<view class="bai"></view>
		</view>
	</view>
	<!-- </view> -->
</template>

<script>
	import config from '../../../common/config.js'

	export default {
		data() {
			return {
				imgfo: 1,
				han: false,
				index: 0,
				index2: 0,

				mainid: '', //	用户ID（mainId）		true					string
				subjectType: '', //	主体类型		true					string
				index3: 0,
				array3: ['是', '否'],
				mainPicId: '', //	证件正面图		true	string
				fimage: '',
				fimage1: '',

				adrname: '',
				latitude: '',
				longitude: '',
				darray: [{
					name: '',
					id: ''
				}],
				dnui1: [],
				dnui2: [],
				dnui3: [],
				dnui4: [],
				dmultiArray: [
					[],
					[],
					[],
					[],
				],
				dmultiIndex: [0, 0, 0, 0],
				dpickerid1: '',
				dpickerid2: '',
				dpickerid3: '',
				dpickerid4: '',
				communitys: '',
				community: '',
				provinceId: '',
				cityId: '',
				districtId: '',
				areaId: '',
				mdxxdz1: '',
				mdxxdz: '',
				diqu: '',


				
				showPhone:true
			}
		},

		onLoad(options) {
			console.log('invitor 页面传参：',options.from2)
			if('php'==options.from2){
				this.showPhone = false
			}
			var _this = this;
			uni.getStorage({
				key: 'user',
				success: function(res) {
					_this.mainid = res.data.id;
					_this.dadr();
					setTimeout(function() {
					}, 500);
				}
			});

		},
		onShow() {},
		methods: {
			confirm(){
				if (this.showPhone&&!this.yqrPhone) {
					uni.showToast({
						title: '请输入邀请人手机号',
						icon: 'none',
						duration: 2000
					});
					return false
				}
				if (!this.dpickerid1) {
					uni.showToast({
						title: '请选择地区',
						icon: 'none',
						duration: 2000
					});
					return false
				}
				if (!this.fimage) {
					uni.showToast({
						title: '请上传身份证正面图片',
						icon: 'none',
						duration: 2000
					});
					return false
				}
				let datas = {
					provinceId:this.dpickerid1,
					cityId:this.dpickerid2,
					areaId:this.dpickerid3,
					streetId:this.dpickerid4,
					// initeUserId:this.yqrPhone,
					yqrPhone:this.yqrPhone,
					userId:this.mainid,
					sfzz:this.fimage,
					sfzf:'',
				}
				if(!this.showPhone){
					datas={
						provinceId:this.dpickerid1,
						cityId:this.dpickerid2,
						areaId:this.dpickerid3,
						streetId:this.dpickerid4,
						userId:this.mainid,
						sfzz:this.fimage,
						sfzf:'',
					}
				}
				console.log('保存请求参数：',datas)
				uni.request({
					// url:'https://k999az04ootw.ngrok2.xiaomiqiu.cn/p/user/userInvite',
					url:config.mallHost +'/p/user/userInvite',
					method:'GET',
					data:datas,
					success: (res) => {
						console.log('保存：',res)
						if(res.data&&res.data.code=="0"){
							uni.showToast({
								title:res.data.msg,
								icon:'none',
								duration:2000
							})
							return false
						}
						if(res.data&&res.data.code == "000"){
							uni.setStorageSync('inviter',this.yqrPhone)
							uni.showToast({
								title:'保存成功，请重新提交订单',
								icon:'none',
								duration:2000
							})
							uni.navigateBack({
								delta:1
							})
						}
						
					},
					fail: (err) => {
						console.log('保存err：',err)
					}
				})
			},
			
			dadr() {
				var _this = this;
				uni.request({
					header: {
						'Content-Type': 'application/x-www-form-urlencoded', //自定义请求头信息
					},
					url: getApp().globalData.url + 'area/areaList/', //仅为示例，并非真实接口地址。
					method: 'POST',
					data: {
						parentId: ''
					},
					success: (res) => {
						if (res.data.status == '200') {
								if(res.data.data.length>0){
							_this.dnui1 = res.data.data;
							for (var i = 0; i < res.data.data.length; i++) {
								_this.dmultiArray[0].push(res.data.data[i].name);
							}
							_this.dpickerid1 = res.data.data[0].id;
							// _this.pid = res.data.data[0].id;
							_this.dadr1();
								}
						}else{
							
								uni.showToast({
									title: '获取省信息失败',
									icon: 'none',
									duration: 1000
								})
						}
					},
					fail: (error) => {
						uni.showToast({
							title: '获取省信息失败',
							icon: 'none',
							duration: 1000
						})
					}
				});
			},
			dadr1() {
				var _this = this;
				uni.request({
					header: {
						'Content-Type': 'application/x-www-form-urlencoded', //自定义请求头信息
					},
					url: getApp().globalData.url + 'area/areaList/' + _this.dpickerid1, //仅为示例，并非真实接口地址。
					method: 'POST',
					data: {
						parentId: _this.dpickerid1 //	用户ID（mainId）
					},
					success: (res) => {
						if (res.data.status == '200') {
								if(res.data.data.length>0){
							_this.dnui2 = res.data.data;
							var list = [];
							for (var i = 0; i < res.data.data.length; i++) {
								list.push(res.data.data[i].name);
							}
							this.dmultiArray.splice(1, 1, list)
							if (!_this.dpickerid2) {
								_this.dpickerid2 = res.data.data[0].id;
							} else {
								// console.log(_this.dpickerid2);
								for (var i = 0; i < _this.dnui2.length; i++) {
									if (_this.dpickerid2 == _this.dnui2[i].id) {
										// console.log(_this.dnui2[i].id);console.log(i);
										_this.dmultiIndex[1] = i;
									}
								}
							}

							this.$forceUpdate();
							_this.dadr2();
								}
						}else{
							uni.showToast({
								title: '获取市信息失败',
								icon: 'none',
								duration: 1000
							})
						}
					},
					fail: (error) => {
						uni.showToast({
							title: '获取市信息失败',
							icon: 'none',
							duration: 1000
						})
					}
				});
			},
			dadr2() {
				var _this = this;
				uni.request({
					header: {
						'Content-Type': 'application/x-www-form-urlencoded', //自定义请求头信息
					},
					url: getApp().globalData.url + 'area/areaList/' + _this.dpickerid2, //仅为示例，并非真实接口地址。
					method: 'POST',
					data: {
						parentId: _this.dpickerid2 //	用户ID（mainId）
					},
					success: (res) => {
						if (res.data.status == '200') {
							if (res.data.data) {
								if(res.data.data.length>0){
								_this.dnui3 = res.data.data;
								var list = [];
								for (var i = 0; i < res.data.data.length; i++) {
									list.push(res.data.data[i].name);
								}
								this.dmultiArray.splice(2, 1, list)
								if (!_this.dpickerid3) {
									_this.dpickerid3 = res.data.data[0].id;
								} else {
									for (var i = 0; i < _this.dnui3.length; i++) {
										if (_this.dpickerid3 == _this.dnui3[i].id) {
											// console.log(_this.dnui2[i].id);console.log(i);
											_this.dmultiIndex[2] = i;
										}
									}
								}
								// console.log(_this.dpickerid3);
								this.$forceUpdate();
								// _this.qid = res.data.data[0].id;
								// _this.dpickerid3 = res.data.data[0].id;
								// _this.districtId = res.data.data[0].id;
								_this.dadr3();
								}
								// console.log(_this.bizAddressCode);
							}
						}else{
							uni.showToast({
								title: '获取区/县信息失败',
								icon: 'none',
								duration: 1000
							})
						}
					},
					fail: (error) => {
						
							uni.showToast({
								title: '获取区/县信息失败',
								icon: 'none',
								duration: 1000
							})
					}
				});
			},
			dadr3() {
				var _this = this;
				uni.request({
					header: {
						'Content-Type': 'application/x-www-form-urlencoded', //自定义请求头信息
					},
					url: getApp().globalData.url + 'area/areaList/' + _this.dpickerid3, //仅为示例，并非真实接口地址。
					method: 'POST',
					data: {
						parentId: _this.qid //	用户ID（mainId）
					},
					success: (res) => {
						if (res.data.status == '200') {
							// console.log(res.data.data);
							
									if(res.data.data.length>0){
								_this.dnui4 = res.data.data;
								var list = [];
								for (var i = 0; i < res.data.data.length; i++) {
									list.push(res.data.data[i].name);
								}
								_this.dmultiArray.splice(3, 1, list)
								if (!_this.dpickerid4) {
									_this.dpickerid4 = res.data.data[0].id;
								} else {
									for (var i = 0; i < _this.dnui4.length; i++) {
										if (_this.dpickerid4 == _this.dnui4[i].id) {
											// console.log(_this.dnui2[i].id);console.log(i);
											_this.dmultiIndex[3] = i;
										}
									}
								}
							}

						}else{
							uni.showToast({
								title: '获取乡镇/街道信息失败',
								icon: 'none',
								duration: 1000
							})
						}
					},
					fail: (error) => {
							uni.showToast({
								title: '获取乡镇/街道信息失败',
								icon: 'none',
								duration: 1000
							})
					}
				});
			},
			xuanzediqu: function(e) {
				var _this = this;
				// console.log(e.detail.column);
				_this.diqu = '';
				_this.adrname1 = '';
				_this.dmultiIndex[e.detail.column] = e.detail.value;
				if (e.detail.column == 0) {
					_this.dmultiArray.splice(1, 1, [])
					_this.dmultiArray.splice(2, 1, [])
					_this.dmultiArray.splice(3, 1, [])
					_this.dpickerid1 = _this.dnui1[e.detail.value].id;
					_this.dpickerid2 = '';
					_this.dpickerid3 = '';
					_this.dpickerid4 = '';
					// _this.provinceId = _this.dnui1[e.detail.value].id;
					_this.dmultiIndex = [e.detail.value, 0, 0, 0];
					_this.dadr1();
				} else if (e.detail.column == 1) {
					_this.dmultiArray.splice(2, 1, [])
					_this.dmultiArray.splice(3, 1, [])
					_this.dpickerid2 = _this.dnui2[e.detail.value].id;
					// _this.cityId = _this.dnui2[e.detail.value].id;
					_this.dpickerid3 = '';
					_this.dpickerid4 = '';
					_this.dmultiIndex[2] = 0;
					_this.dmultiIndex[3] = 0;
					// _this.bizAddressCode = _this.dnui2[e.detail.value].id;
					
					if(_this.dpickerid2){						
						_this.dadr2();
					}
				} else if (e.detail.column == 2) {
					_this.dmultiArray.splice(3, 1, [])
					_this.dpickerid3 = _this.dnui3[e.detail.value].id;
					_this.districtId = _this.dnui3[e.detail.value].id;
					_this.dpickerid4 = '';
					_this.dmultiIndex[3] = 0;
					
					if(_this.dpickerid3){						
						_this.dadr3();
					}
				} else if (e.detail.column == 3) {
					_this.dmultiIndex[3] = e.detail.value;
					_this.dpickerid4 = _this.dnui4[e.detail.value].id;
					_this.areaId = _this.dnui4[e.detail.value].id;
					// _this.xiaoqu();
				}
				this.$forceUpdate()
			},
			

			fchooseImage: function() {
				var _this = this;
				uni.chooseImage({
					count: 1,
					sizeType: ['compressed'],
					sourceType: ['album'],
					success: function(res) {
						var tempFilePaths = res.tempFilePaths;
						_this.fimage = tempFilePaths[0];
						var uploadTask = uni.uploadFile({
							url: getApp().globalData.url + 'file/uploadThird',
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {
								// 'files':tempFilePaths[i],
							},
							success: function(uploadFileRes) {
								var datamain = JSON.parse(uploadFileRes.data);
								console.log(datamain);
								if (datamain.status == 200) {
									var url = datamain.data.domain + datamain.data.localPath;
									_this.fimage = url;
									_this.mainPicId = datamain.data.id;
									console.log(url);

								} else {
									uni.showToast({
										title: datamain.msg,
										icon: 'none',
										duration: 1000
									})
								}
							}
						});
					},
					error: function(e) {
						console.log(e);
						uni.showToast({
							title: '上传失败',
							icon: 'none',
							duration: 1000
						})
					}
				});

			},

		}
	}
</script>

<style>
	.imgi image.del {
		width: 6vw;
		height: 6vw;
		display: block;
		position: absolute;
		/* background: url(../../static/img/bg.png) repeat; */
		background: url(../../../static/img/bg.png) repeat;
		top: 0;
		right: 0;
		z-index: 9;
	}

	.baodan_into {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		line-height: 7vw;
		display: block;
		float: left;
		min-height: 40vw;
		background: url(../../../static/img/jiaa.png) no-repeat center;
	}

	.baodan_into_image {
		width: 90%;
		height: auto;
		display: block;
		float: left;
		margin: 0 5%;
	}

	.shuru_text1 {
		width: 100%;
		height: 10vw;
		line-height: 10vw;
		display: block;
		float: left;
	}

	.shuru_text2 {
		width: 45%;
		height: auto;
		min-height: 6vw;
		float: left;
		background: url(../../../static/img/turn.png) no-repeat right center;
		background-size: 3vw;
		line-height: 6vw;
		text-align: right;
		padding: 2vw 0;
		padding-right: 4vw;
	}

	.baodan_into1 {
		width: 30%;
		height: 24vw;
		display: block;
		float: left;
		line-height: 7vw;
		display: block;
		float: left;
		background: url(../../../static/img/jiaa.png) no-repeat center;
		border: 1px solid #eee;
		border-radius: 2vw;
		margin: 2vw 1.6%;
	}

	.imgi {
		width: 30%;
		height: 24vw;
		display: block;
		float: left;
		border: 1px solid #eee;
		margin: 2vw 1.6%;
		border-radius: 2vw;
		overflow: hidden;
		position: relative;
	}

	.imgi image {
		width: 100%;
		height: 100%;
		display: block;
		float: left;
	}

	.baodan_into_image {
		width: 90%;
		height: auto;
		display: block;
		float: left;
		margin: 0 5%;
	}

	.bai {
		width: 100%;
		height: 30vw;
		display: block;
		float: left;
	}

	.center_qb {
		width: 100%;
		height: auto;
		line-height: 8vw;
		display: block;
		float: left;
		padding: 2vw 0;
	}

	.login_main_li_yzm {
		width: auto;
		height: 8vw;
		display: block;
		float: right;
		background: #fcbe16;
		padding: 0 3vw;
		line-height: 8vw;
		border-radius: 4vw;
	}

	.shuru {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		border-radius: 1vw;
		overflow: hidden;
		padding: 2vw 4vw;
		background: #fff;
		margin-top: 4vw;
		box-shadow: 0px 0px 5px #eee;
	}

	.shuru_tit {
		width: 50%;
		height: 10vw;
		line-height: 10vw;
		display: block;
		float: left;
	}

	.shuru_text {
		width: 50%;
		height: 10vw;
		line-height: 10vw;
		display: block;
		float: right;
		text-align: right;
	}

	select.shuru_text {
		border: none;
	}



	.baodan_zhu {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		margin: 2vw 0;
		background: #fff;
		border-radius: 1vw;
		padding: 4vw;
		box-shadow: 0px 0px 5px #eee;
		margin-top: 4vw;
	}

	.baodan_tit {
		width: 100%;
		height: 8vw;
		line-height: 8vw;
		display: block;
		float: left;
		text-align: center;
	}

	.baodan_into {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		line-height: 7vw;
		display: block;
		float: left;
		min-height: 40vw;
		background: url(../../../static/img/jiaa.png) no-repeat center;
	}

	.baodan_into_image {
		width: 90%;
		height: auto;
		display: block;
		float: left;
		margin: 0 5%;
	}

	.shuru_text1 {
		width: 100%;
		height: 10vw;
		line-height: 10vw;
		display: block;
		float: left;
	}

	/* 	.shuru_text2 {
		background: url(../../static/img/turn.png) no-repeat right center;
		background-size: 3vw;
		line-height: 10vw;
		text-align: right;
		padding-right: 4vw;
		height: 10vw;
		overflow: hidden;
	}
 */
	.baodan_into_image_load {
		width: 20vw;
		height: 20vw;
		position: absolute;
		top: 12vw;
		left: 50%;
		z-index: 999;
		background: #000;
		padding: 7vw;
		border-radius: 3vw;
		margin-left: -10vw;
	}
	.hint-addr{
		margin-top: 8upx;
		font-size: 28upx;
		color:#333;
	}
</style>
